<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>高校教师个人教学科研成果管理系统</title>
    <link rel="stylesheet" href="css/style.css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
</head>
<body>
    <div class="container">
        <!-- 侧边栏 -->
        <div class="sidebar">
            <div class="sidebar-header">
                <h2><i class="fas fa-graduation-cap"></i> 教学科研管理系统</h2>
            </div>
            <nav class="sidebar-nav">
                <ul>
                    <li class="active" data-tab="student-management">
                        <i class="fas fa-users"></i> 学生管理
                    </li>
                    <li data-tab="paper-management">
                        <i class="fas fa-file-alt"></i> 论文管理
                    </li>
                    <li data-tab="vertical-project">
                        <i class="fas fa-project-diagram"></i> 纵向课题
                    </li>
                    <li data-tab="horizontal-project">
                        <i class="fas fa-tasks"></i> 横向课题
                    </li>
                    <li data-tab="statistics">
                        <i class="fas fa-chart-bar"></i> 统计分析
                    </li>
                </ul>
            </nav>
        </div>

        <!-- 主内容区 -->
        <div class="main-content">
            <!-- 学生管理页面 -->
            <div id="student-management" class="tab-content active">
                <div class="content-header">
                    <h1>学生管理</h1>
                    <button class="btn btn-primary" onclick="showAddStudentModal()">
                        <i class="fas fa-plus"></i> 添加学生
                    </button>
                </div>

                <!-- 筛选区域 -->
                <div class="filter-section">
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>姓名：</label>
                            <input type="text" id="filter-name" placeholder="请输入姓名">
                        </div>
                        <div class="filter-item">
                            <label>学号：</label>
                            <input type="text" id="filter-studentNumber" placeholder="请输入学号">
                        </div>
                        <div class="filter-item">
                            <label>专业：</label>
                            <input type="text" id="filter-major" placeholder="请输入专业">
                        </div>
                    </div>
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>年级：</label>
                            <input type="text" id="filter-grade" placeholder="请输入年级">
                        </div>
                        <div class="filter-item">
                            <label>院系：</label>
                            <input type="text" id="filter-department" placeholder="请输入院系">
                        </div>
                        <div class="filter-item">
                            <label>状态：</label>
                            <select id="filter-status">
                                <option value="">全部</option>
                                <option value="1">在读</option>
                                <option value="2">毕业</option>
                                <option value="3">休学</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <button class="btn btn-secondary" onclick="filterStudents()">
                                <i class="fas fa-search"></i> 筛选
                            </button>
                            <button class="btn btn-outline" onclick="resetFilter()">
                                <i class="fas fa-redo"></i> 重置
                            </button>
                        </div>
                    </div>
                </div>

                <!-- 学生列表 -->
                <div class="table-container">
                    <table class="data-table">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>学号</th>
                                <th>姓名</th>
                                <th>专业</th>
                                <th>班级</th>
                                <th>年级</th>
                                <th>院系</th>
                                <th>导师</th>
                                <th>入学时间</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="student-table-body">
                            <!-- 数据将通过JavaScript动态加载 -->
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- 论文管理页面 -->
            <div id="paper-management" class="tab-content">
                <div class="content-header">
                    <h1>论文管理</h1>
                    <button class="btn btn-primary" onclick="showAddPaperModal()">
                        <i class="fas fa-plus"></i> 添加论文
                    </button>
                </div>

                <!-- 论文筛选区域 -->
                <div class="filter-section">
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>论文名称：</label>
                            <input type="text" id="filter-paperName" placeholder="请输入论文名称">
                        </div>
                        <div class="filter-item">
                            <label>发表时间：</label>
                            <input type="date" id="filter-startDate" placeholder="开始时间">
                        </div>
                        <div class="filter-item">
                            <label>至：</label>
                            <input type="date" id="filter-endDate" placeholder="结束时间">
                        </div>
                    </div>
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>检索级别：</label>
                            <select id="filter-retrievalLevel">
                                <option value="">全部</option>
                                <option value="SCI">SCI</option>
                                <option value="EI">EI</option>
                                <option value="核心期刊">核心期刊</option>
                                <option value="普通期刊">普通期刊</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <label>状态：</label>
                            <select id="filter-paperStatus">
                                <option value="">全部</option>
                                <option value="0">待审核</option>
                                <option value="1">已通过</option>
                                <option value="2">已拒绝</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <button class="btn btn-secondary" onclick="filterPapers()">
                                <i class="fas fa-search"></i> 筛选
                            </button>
                            <button class="btn btn-outline" onclick="resetPaperFilter()">
                                <i class="fas fa-redo"></i> 重置
                            </button>
                        </div>
                    </div>
                </div>

                <!-- 论文列表 -->
                <div class="table-container">
                    <table class="data-table">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>论文名称</th>
                                <th>作者</th>
                                <th>期刊名称</th>
                                <th>发表时间</th>
                                <th>检索级别</th>
                                <th>影响因子</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="paper-table-body">
                            <!-- 数据将通过JavaScript动态加载 -->
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- 纵向课题页面 -->
            <div id="vertical-project" class="tab-content">
                <div class="content-header">
                    <h1>纵向课题管理</h1>
                    <button class="btn btn-primary" onclick="showAddVerticalProjectModal()">
                        <i class="fas fa-plus"></i> 添加课题
                    </button>
                </div>

                <!-- 纵向课题筛选区域 -->
                <div class="filter-section">
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>课题名称：</label>
                            <input type="text" id="filter-verticalName" placeholder="请输入课题名称">
                        </div>
                        <div class="filter-item">
                            <label>项目类型：</label>
                            <select id="filter-verticalType">
                                <option value="">全部</option>
                                <option value="国家自然科学基金">国家自然科学基金</option>
                                <option value="国家社会科学基金">国家社会科学基金</option>
                                <option value="省自然科学基金">省自然科学基金</option>
                                <option value="省社会科学基金">省社会科学基金</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <label>状态：</label>
                            <select id="filter-verticalStatus">
                                <option value="">全部</option>
                                <option value="0">待审核</option>
                                <option value="1">已通过</option>
                                <option value="2">已拒绝</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <button class="btn btn-secondary" onclick="filterVerticalProjects()">
                                <i class="fas fa-search"></i> 筛选
                            </button>
                            <button class="btn btn-outline" onclick="resetVerticalFilter()">
                                <i class="fas fa-redo"></i> 重置
                            </button>
                        </div>
                    </div>
                </div>

                <!-- 纵向课题列表 -->
                <div class="table-container">
                    <table class="data-table">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>课题名称</th>
                                <th>项目类型</th>
                                <th>负责人</th>
                                <th>开始时间</th>
                                <th>结束时间</th>
                                <th>经费(万元)</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="vertical-project-table-body">
                            <!-- 数据将通过JavaScript动态加载 -->
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- 横向课题页面 -->
            <div id="horizontal-project" class="tab-content">
                <div class="content-header">
                    <h1>横向课题管理</h1>
                    <button class="btn btn-primary" onclick="showAddHorizontalProjectModal()">
                        <i class="fas fa-plus"></i> 添加课题
                    </button>
                </div>

                <!-- 横向课题筛选区域 -->
                <div class="filter-section">
                    <div class="filter-row">
                        <div class="filter-item">
                            <label>课题名称：</label>
                            <input type="text" id="filter-horizontalName" placeholder="请输入课题名称">
                        </div>
                        <div class="filter-item">
                            <label>合作单位：</label>
                            <input type="text" id="filter-cooperationUnit" placeholder="请输入合作单位">
                        </div>
                        <div class="filter-item">
                            <label>状态：</label>
                            <select id="filter-horizontalStatus">
                                <option value="">全部</option>
                                <option value="0">待审核</option>
                                <option value="1">已通过</option>
                                <option value="2">已拒绝</option>
                            </select>
                        </div>
                        <div class="filter-item">
                            <button class="btn btn-secondary" onclick="filterHorizontalProjects()">
                                <i class="fas fa-search"></i> 筛选
                            </button>
                            <button class="btn btn-outline" onclick="resetHorizontalFilter()">
                                <i class="fas fa-redo"></i> 重置
                            </button>
                        </div>
                    </div>
                </div>

                <!-- 横向课题列表 -->
                <div class="table-container">
                    <table class="data-table">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>课题名称</th>
                                <th>合作单位</th>
                                <th>负责人</th>
                                <th>开始时间</th>
                                <th>结束时间</th>
                                <th>经费(万元)</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="horizontal-project-table-body">
                            <!-- 数据将通过JavaScript动态加载 -->
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- 统计分析页面 -->
            <div id="statistics" class="tab-content">
                <div class="content-header">
                    <h1>统计分析</h1>
                </div>
                <div class="stats-container">
                    <div class="stats-grid">
                        <div class="stats-card">
                            <div class="stats-icon">
                                <i class="fas fa-users"></i>
                            </div>
                            <div class="stats-content">
                                <h3 id="total-students">0</h3>
                                <p>学生总数</p>
                            </div>
                        </div>
                        <div class="stats-card">
                            <div class="stats-icon">
                                <i class="fas fa-file-alt"></i>
                            </div>
                            <div class="stats-content">
                                <h3 id="total-papers">0</h3>
                                <p>论文总数</p>
                            </div>
                        </div>
                        <div class="stats-card">
                            <div class="stats-icon">
                                <i class="fas fa-project-diagram"></i>
                            </div>
                            <div class="stats-content">
                                <h3 id="total-vertical-projects">0</h3>
                                <p>纵向课题</p>
                            </div>
                        </div>
                        <div class="stats-card">
                            <div class="stats-icon">
                                <i class="fas fa-tasks"></i>
                            </div>
                            <div class="stats-content">
                                <h3 id="total-horizontal-projects">0</h3>
                                <p>横向课题</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 添加学生模态框 -->
    <div id="addStudentModal" class="modal">
        <div class="modal-content">
            <div class="modal-header">
                <h2>添加学生</h2>
                <span class="close" onclick="closeModal('addStudentModal')">&times;</span>
            </div>
            <div class="modal-body">
                <form id="addStudentForm">
                    <div class="form-row">
                        <div class="form-group">
                            <label>学号 *</label>
                            <input type="text" id="studentNumber" name="studentNumber" required>
                        </div>
                        <div class="form-group">
                            <label>姓名 *</label>
                            <input type="text" id="name" name="name" required>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>专业</label>
                            <input type="text" id="major" name="major">
                        </div>
                        <div class="form-group">
                            <label>班级</label>
                            <input type="text" id="className" name="className">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>年级</label>
                            <input type="text" id="grade" name="grade">
                        </div>
                        <div class="form-group">
                            <label>院系</label>
                            <input type="text" id="department" name="department">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>导师</label>
                            <input type="text" id="supervisor" name="supervisor">
                        </div>
                        <div class="form-group">
                            <label>入学时间</label>
                            <input type="date" id="enrollmentDate" name="enrollmentDate">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>研究方向</label>
                            <input type="text" id="researchDirection" name="researchDirection">
                        </div>
                        <div class="form-group">
                            <label>学历层次</label>
                            <select id="academicLevel" name="academicLevel">
                                <option value="">请选择</option>
                                <option value="本科">本科</option>
                                <option value="硕士">硕士</option>
                                <option value="博士">博士</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>状态</label>
                            <select id="status" name="status">
                                <option value="1">在读</option>
                                <option value="2">毕业</option>
                                <option value="3">休学</option>
                            </select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" onclick="closeModal('addStudentModal')">取消</button>
                <button class="btn btn-primary" onclick="addStudent()">保存</button>
            </div>
        </div>
    </div>

    <!-- 编辑学生模态框 -->
    <div id="editStudentModal" class="modal">
        <div class="modal-content">
            <div class="modal-header">
                <h2>编辑学生</h2>
                <span class="close" onclick="closeModal('editStudentModal')">&times;</span>
            </div>
            <div class="modal-body">
                <form id="editStudentForm">
                    <input type="hidden" id="edit-id" name="id">
                    <div class="form-row">
                        <div class="form-group">
                            <label>学号 *</label>
                            <input type="text" id="edit-studentNumber" name="studentNumber" required>
                        </div>
                        <div class="form-group">
                            <label>姓名 *</label>
                            <input type="text" id="edit-name" name="name" required>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>专业</label>
                            <input type="text" id="edit-major" name="major">
                        </div>
                        <div class="form-group">
                            <label>班级</label>
                            <input type="text" id="edit-className" name="className">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>年级</label>
                            <input type="text" id="edit-grade" name="grade">
                        </div>
                        <div class="form-group">
                            <label>院系</label>
                            <input type="text" id="edit-department" name="department">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>导师</label>
                            <input type="text" id="edit-supervisor" name="supervisor">
                        </div>
                        <div class="form-group">
                            <label>入学时间</label>
                            <input type="date" id="edit-enrollmentDate" name="enrollmentDate">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>研究方向</label>
                            <input type="text" id="edit-researchDirection" name="researchDirection">
                        </div>
                        <div class="form-group">
                            <label>学历层次</label>
                            <select id="edit-academicLevel" name="academicLevel">
                                <option value="">请选择</option>
                                <option value="本科">本科</option>
                                <option value="硕士">硕士</option>
                                <option value="博士">博士</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>状态</label>
                            <select id="edit-status" name="status">
                                <option value="1">在读</option>
                                <option value="2">毕业</option>
                                <option value="3">休学</option>
                            </select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" onclick="closeModal('editStudentModal')">取消</button>
                <button class="btn btn-primary" onclick="updateStudent()">保存</button>
            </div>
        </div>
    </div>

    <!-- 添加论文模态框 -->
    <div id="addPaperModal" class="modal">
        <div class="modal-content">
            <div class="modal-header">
                <h2>添加论文</h2>
                <span class="close" onclick="closeModal('addPaperModal')">&times;</span>
            </div>
            <div class="modal-body">
                <form id="addPaperForm">
                    <div class="form-row">
                        <div class="form-group">
                            <label>论文名称 *</label>
                            <input type="text" id="paperName" name="paperName" required>
                        </div>
                        <div class="form-group">
                            <label>作者 *</label>
                            <input type="text" id="author" name="author" required>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>期刊名称</label>
                            <input type="text" id="journalName" name="journalName">
                        </div>
                        <div class="form-group">
                            <label>发表时间</label>
                            <input type="date" id="publishDate" name="publishDate">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>检索级别</label>
                            <select id="retrievalLevel" name="retrievalLevel">
                                <option value="">请选择</option>
                                <option value="SCI">SCI</option>
                                <option value="EI">EI</option>
                                <option value="核心期刊">核心期刊</option>
                                <option value="普通期刊">普通期刊</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label>影响因子</label>
                            <input type="number" id="impactFactor" name="impactFactor" step="0.01">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group">
                            <label>DOI</label>
                            <input type="text" id="doi" name="doi">
                        </div>
                        <div class="form-group">
                            <label>状态</label>
                            <select id="paperStatus" name="status">
                                <option value="0">待审核</option>
                                <option value="1">已通过</option>
                                <option value="2">已拒绝</option>
                            </select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" onclick="closeModal('addPaperModal')">取消</button>
                <button class="btn btn-primary" onclick="addPaper()">保存</button>
            </div>
        </div>
    </div>

    <script src="js/script.js"></script>
</body>
</html> 